<template>
    <div class="basic-info">
        <table>
            <tr>
                <td class="table-key">
                    <span>昵称:</span>
                </td>
                <td class="table-value">
                    <el-input v-model="input" placeholder="请输入昵称"/>
                </td>
            </tr>
            <tr>
                <td class="table-key">
                    <span>性别:</span>
                </td>
                <td class="table-value">
                    <el-radio-group v-model="gender" class="ml-4">
                        <el-radio value="0" size="large">男</el-radio>
                        <el-radio value="1" size="large">女</el-radio>
                        <el-radio value="2" size="large">保密</el-radio>
                    </el-radio-group>
                </td>
            </tr>
            <tr>
                <td class="table-key">
                    <span>生日</span>
                </td>
                <td class="table-value">
                    <el-date-picker
                        v-model="dateValue"
                        type="date"
                        placeholder="Pick a day"
                        :size="size"
                        />
                </td>
            </tr>
            <tr>
                <td class="table-key">
                </td>
                <td class="submit">
                    <el-button type="success">提交</el-button>
                </td>
            </tr>
        </table>
    </div>
</template>

<script setup>
    import { ref } from 'vue'
    const gender = ref('1')
    const dateValue = ref('2050-12-12')
    const input = ref('')

</script>

<style lang="less" scoped>
    .basic-info {
        width: 800px;
        height: 300px;
        background-color: #fff;
        table {
            padding-top: 20px;
            tr {
                .table-key {
                    padding-left: 20px;
                    font-weight:700;
                }
                .table-value {
                    padding-left: 20px;
                }
                .submit {
                    padding-top: 20px;
                    padding-left: 150px;
                }
            }
        }
    }
</style>